Page Tutor.com

Ver paleta en resolución completa.

REFERENCIA:Page Tutor.com

Imagen transparente de fondo

La propiedad opacity añade opacidad a cualquier contenido, sin embargo esa opacidad al ser añadida al contenido también se añade a las imágenes y el texto.

Conseguimos solucionar ese problema y en mi opinión es la solución más acertada, pero hay quien prefiere una solución más rápida que viene a ser lo mismo que decir más práctica.

Esa solución es añadir una imagen trasparente de fondo de la misma forma que añadiríamos un fondo cualquiera: background-image:url(url de la imagen de fondo);
Un ejemplo del resultado.

Si no sabemos crear una imagen transparente en Utilidades para Webmasters nos ofrecen un buen recurso se trata de Trasluscent una paleta de colores transparentes que podemos usar libremente por el precio de un enlace a la página del autor y las explicaciones para crear colores transparentes con Adobe Photoshop si optamos por crearlos nosotros mismos.

Feliz Navidad 2.009

En cada letra dejo escondido un deseo
para que se cumplan todos vuestros sueños.¡¡ FELIZ NAVIDAD !!

Generador de tablas

A veces es necesario mostrar un contenido de forma ordenada y las tablas son una buena solución, crearlas no es nada complicado pero con este generador de w3schools.com la tarea resulta mucho más sencilla.

Para crear una tabla eliminaremos parte del código del panel de la izquierda que no vamos a utilizar hasta dejar  lo siguiente

Seguir leyendo [+/-]

<style type="text/css">

table{

border-collapse:collapse;}

table, td, th{

border:1px solid black;}

</style>

<table>

<tr>

<th>IMAGEN</th>

<th>IMAGEN</th>

<th>IMAGEN</th>

<th>IMAGEN</th>

<th>IMAGEN</th>

</tr>

<tr>

<td>TEXTO</td>

<td>TEXTO</td>

<td>TEXTO</td>

<td>TEXTO</td>

<td>TEXTO</td>

</tr>

</table>

Lo primero son los estilos, podemos añadir distinto color de borde en border:1px solid black, de fuente añadiendo color:#CCCCCC o añadir color de fondo añadiendo background-color:#eeeeee;

Lo segundo es la tabla, la primera parte viene para añadir texto pero también podemos añadir una imagen con <img src="url-de-la-imagen"> si preferimos que esa imagen sea un enlace:

<a href="url-de-la-página"><img src="url-de-la-imagen"></a>

Cada vez que hacemos un cambio podemos ver el resultado marcando el botón "Edit and Click Me" una vez tenemos el resultado esperado copiamos el código y lo pegamos donde deseamos añadir la tabla.

Porque la fecha lo requiere más iconos navideños

icondrawer

Christmas Icons

DeviantART

deviantART